<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- The HTML 4.01 Transitional DOCTYPE declaration-->
<!-- above set at the top of the file will set     -->
<!-- the browser's rendering engine into           -->
<!-- "Quirks Mode". Replacing this declaration     -->
<!-- with a "Standards Mode" doctype is supported, -->
<!-- but may lead to some differences in layout.   -->

<html lang="en">
<head>
<meta charset="utf-8">
<title>StudyBuddy</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="StudyBuddy">
<meta name="author" content="TeamOS">

<!-- Le styles -->
<link href="./css/bootstrap.css" rel="stylesheet">
<style type="text/css">
body {
	padding-top: 60px;
	padding-bottom: 40px;
}

.sidebar-nav {
	padding: 9px 0;
}
</style>
<link href="./css/bootstrap-responsive.css" rel="stylesheet">

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
			  <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
			<![endif]-->

<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="ico/favicon.ico">
<link rel="apple-touch-icon" href="ico/bootstrap-apple-57x57.png">
<link rel="apple-touch-icon" sizes="72x72"
	href="ico/bootstrap-apple-72x72.png">
<link rel="apple-touch-icon" sizes="114x114"
	href="ico/bootstrap-apple-114x114.png">
</head>

<body>

	<div class="navbar navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container-fluid">
				<a class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse"> <span class="icon-bar"></span> <span
					class="icon-bar"></span> <span class="icon-bar"></span>
				</a> <a class="brand" href="#">StudyBuddy</a>
				<div class="nav-collapse">
					<ul class="nav">
						<!-- 						<li class="active"><a href="#">Home</a></li> -->
						<!-- 						<li><a href="/browse.jsp">Browse</a></li> -->
					</ul>
					<p class="navbar-text pull-right">
						<a href="javascript:login();">Log-in</a>
					</p>
				</div>
				<!--/.nav-collapse -->
			</div>
		</div>
	</div>

	<div class="container-fluid">
		<div class="row-fluid">
			<!--/span-->
			<div class="hero-unit-index">
				<h1>Study Buddy!</h1>
				<p></p>
				<p>
					<img src="./img/studybuddysmall.jpg"
						alt="Study Buddy Index Picture" />
				</p>
				<p>
					<a class="btn btn-primary btn-large" href="javascript:login();">Get
						Started &raquo;</a>
				</p>
			</div>
		</div>
		<!--/row-->

		<hr>
		<footer> <jsp:include page="./footer.jsp" /> </footer>

	</div>
	<!--/.fluid-container-->

	<!-- Le javascript
		================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="./js/tests/vendor/jquery.js"></script>
	<script src="./js/bootstrap-transition.js"></script>
	<script src="./js/bootstrap-alert.js"></script>
	<script src="./js/bootstrap-modal.js"></script>
	<script src="./js/bootstrap-dropdown.js"></script>
	<script src="./js/bootstrap-scrollspy.js"></script>
	<script src="./js/bootstrap-tab.js"></script>
	<script src="./js/bootstrap-tooltip.js"></script>
	<script src="./js/bootstrap-popover.js"></script>
	<script src="./js/bootstrap-button.js"></script>
	<script src="./js/bootstrap-collapse.js"></script>
	<script src="./js/bootstrap-carousel.js"></script>
	<script src="./js/bootstrap-typeahead.js"></script>
	<script src="./js/index.js"></script>
</body>
</html>
